<template>
	<div>
		<Homeheader></Homeheader>
		<HomeSwiper :list="swiperList"></HomeSwiper>
		<HomeIcons :list="iconList"></HomeIcons>
		<HomeRecommend :list="recommendList"></HomeRecommend>
	</div>
</template>
<script>
import Homeheader from './components/Header'
import HomeSwiper from './components/Swiper'
import HomeIcons from './components/Icons'
import HomeRecommend from './components/Recommend'
import { mapState } from 'vuex'
export default {
	name: 'Home',
	components: {
		Homeheader,
		HomeSwiper,
		HomeIcons,
		HomeRecommend
	},
	data () {
		return {
			lastcity: '',
			swiperList: [],
			iconList: [],
			recommendList: []
		}
	},
	computed: {
		...mapState(['city'])
	},
	methods: {
		getHome () {
			let params = {
				city: this.city
			}
			this.$api.getData.getIndex(params)
			.then(res => {
				if (res.ret) {	
					const data = res.data			
					this.swiperList = data.swiperList
					this.iconList = data.iconList
					this.recommendList = data.recommendList					
				}
			})
		}
	},
	mounted () {
		this.lastcity = this.city
		this.getHome()
	},
	// keep-alive生命周期函数
	// 当页面重新显示的时候执行
	activated () {
		if (this.lastcity !== this.city) {
			this.lastcity = this.city
			this.getHome()
		}
	}
}
</script>

